<template>
	<view class="coupon-page">


		<u-tabs :list="tabList" :currrent='currrentTab' @change='changeTab'></u-tabs>

		<view v-show="currentTab == 0">
			<coupon-list :couponList="couponList"></coupon-list>
		</view>
		<view v-show="currentTab == 1">
			<use-list :list="usedList"></use-list>
		</view>
		<view v-show="currentTab == 2">
			<use-list :list="overdueList"></use-list>
		</view>
	</view>
</template>

<script>
	import CouponList from '../../components/couponList/CouponList.vue'
	import UseList from '../../components/couponList/UseList.vue'
	import {
		queryCouponList,
		queryGiveCouponList
	} from '../../common/http/api.js'
	export default {
		components: {
			CouponList,
			UseList
		},
		data() {
			return {
				couponList: [],
				usedList: [],
				overdueList: [],
				tabList: [],
				currentTab: 0
			}
		},
		methods: {
			changeTab(e) {
				this.currentTab = e.index
			}
		},
		onLoad(options) {
			uni.setNavigationBarTitle({
				title: this.$store.state.cinemaName
			})
			if (options.isRedirect) {
				uni.setNavigationBarTitle({
					title: '←点击主页查看热映电影'
				})
			}
			queryCouponList(uni.getStorageSync("openId")).then(res => {
				const {
					obj,
					code,
					msg
				} = res
				if (code === '000') {
					const list = obj.filter(item => item.orderCode != null)
					list.map(item => {
						if (item.flag === '1') {
							this.couponList.push(item)
						} else if (item.flag === '2') {
							this.usedList.push(item)
						} else {
							this.overdueList.push(item)
						}
					})
					this.tabList.push({
						name: `可使用(${this.couponList.length})`
					})
					this.tabList.push({
						name: `已使用(${this.usedList.length})`
					})
					this.tabList.push({
						name: `已失效(${this.overdueList.length})`
					})
				} else {
					uni.showToast({
						title: msg,
						icon: 'none'
					})
				}
			})
			queryGiveCouponList(uni.getStorageSync("openId")).then(res => {
				const {
					obj,
					code,
					msg
				} = res
				if (code === '000') {
					const list = obj.filter(item => item.orderCode != null)
					list.map(item => {
						if (item.expiredType === '0') {
							this.couponList.push(item)
						} else if (item.expiredType === '1') {
							this.usedList.push(item)
						} else {
							this.overdueList.push(item)
						}
					})
				} else {
					uni.showToast({
						title: msg,
						icon: 'none'
					})
				}
			})
		},
		computed: {
			contrastTime() {
				return time => {
					const currentTime = new Date().getTime()
					const ticketTime = new Date(time).getTime()
					return ticketTime > currentTime
				}
			}
		}
	}
</script>

<style lang="scss">
	.coupon-page {
		height: 100vh;
		background-color: #f0f0f5;
	}
</style>